<template>
    <div style="padding: 20px;">
    	<!--<transition name="custom-classes-transition" enter-active-class="animated fadeInDown" leave-active-class="animated fadeOutUp" >
      		<addcalculation v-on:chance="chance" v-if="show"></addcalculation>
      	</transition>-->
        <div class="changegray">
        	<Row>
	        	<Col span="24" style="text-align: left;margin-top:15px;">
	        		<span>应往届：</span>
			        	<RadioGroup v-model="sessionCode" type="button" @on-change="sessionCodeChange">
			        		<Radio v-for="item in sessionCodeList" :key="item.value" :label="item.value">{{item.label}}</Radio>
				    	</RadioGroup>
				    <!--<Spin size="large" fix v-if="gradelistshow"></Spin>-->
		        </Col>
		    </Row>
        	<Row v-if="sessionCode==1?true:false">
	        	<Col span="24" style="text-align: left;margin-top:15px;">
	        		<span>年级筛选：</span>
			        	<RadioGroup v-model="gradeselect" type="button" @on-change="gradechange">
			        		<Radio v-for="item in gradelist" :key="item.value" :label="item.value">{{item.label}}</Radio>
					        
				    	</RadioGroup>
				    <Spin size="large" fix v-if="gradelistshow"></Spin>
		        </Col>
		    </Row>
		    <Row v-if="sessionCode==0?true:false">
	        	<Col span="24" style="text-align: left;margin-top:15px;">
	        		<span>毕业年份：</span>
		        	<Input v-model="graduateYear" style="width: 100px;"   placeholder="请输入毕业年份"  />
		        	<Button @click="getGraduateList" type="primary"  >查询</Button>
		        </Col>
		    </Row>
		    <Row >
		        <Col span="10" style="text-align: left;margin-top:15px;font-size: 18px;">
		        	<span>计算完成列表</span>
		        </Col> 
		        <!--<Col span="14" style="text-align: right;margin-top:15px;font-size: 16px;">
		        	<Button v-if='achievements_query_add'  @click="addcalculation" type="success" size="small"><i class="iconfont alicon-add1"></i></Button>
		        </Col> -->
		    </Row>
		    <Row v-if='list.length == 0?true:false'>
		        <Col span="24" style="text-align: center;margin-top:15px;font-size: 14px;">
		        	<span>{{textinfo}}</span>
		        </Col> 
		         
		    </Row>
		    <div style="position: relative;">
	        	<Row v-for="item in list" :key="item.performanceId" style="margin-top:15px;text-align: left;">   			
			        <Col span="24" >
			        	<Card>
					        <Row >   			
			        			<Col span="24">
						        	{{item.performanceName}}
			        			</Col>			        
							</Row>
							<Row style="margin-top:10px;text-align: left;">   			
			        			<Col span="5">
						        	年段：{{item.gradeName}}
			        			</Col>
			        			<Col span="6">
						        	基数：{{item.baseExamName}}
			        			</Col>
			        			<Col span="6">
						        	本次：{{item.thisExamName}}
			        			</Col>
			        			<Col span="5">
						        	时间：{{item.createTime}}
			        			</Col>
			        			<Col span="2">
			        				<Tooltip content="查看详细数据" theme="light">
						        		<Button type="ghost" shape="circle" icon="ios-keypad" @click="lookdetail(item.performanceId,item.gradeId,item.performanceName,item.gradeName,item.baseExamName,item.thisExamName,item.createTime)"></Button>
						        	</Tooltip>
						        	<!--<Tooltip content="删除此数据" theme="light">
						        		<Button type="ghost" shape="circle" icon="trash-a" @click="deldata(item.performanceId)"></Button>
						        	</Tooltip>-->
			        			</Col>
							</Row>
					    </Card>
			        </Col>	
				</Row> 
				<Spin size="large" fix v-if="listshow"></Spin>
		    </div>
        </div>
       
		<Page style="text-align: center;margin-top:15px;" :current="current" :total="recordCount" @on-change="pageChange"/>
       
       
    </div>
</template>

<script>
	import api from "@/components/js/Apidomain.js"
	import { setsessionstorage,getsessionstorage } from '@/components/js/Localstorage'
	import addcalculation from '@/components/performance/performancequery/middle/Addcalculation'
	import { mapMutations } from 'vuex'
    export default {
    	name: 'performancequery_keep_alive',
        data() {
            return {
				listshow:false,						//切换评价列表的加载中显示隐藏
//				show:false,							//切换添加评价计算的显示隐藏
				gradelistshow:false,				//控制年级选择框的加载中的显示和隐藏
				
//				achievements_query_add:false,		//控制新增计算按钮是否显示
				
				textinfo:'请选择或输入参数',						//没有数据的时候显示
				
				list:[
//					{"id":110,"name":"2018年期末考评价计算","grade":"高二年级","cardinalNumber":"2017年期末考试","thisTime":"2018年期末考试","time":"2018-07-23"},
//					{"id":111,"name":"2018年期末考评价计算","grade":"高二年级","cardinalNumber":"2017年期末考试","thisTime":"2018年期末考试","time":"2018-07-23"},
				],
				gradeselect:"",
				gradelist: [
//					{value: '1',label: '全部'},{value: '2',label: '初一'},{value: '3',label: '初二'},{value: '4',label: '初三'},{value: '5',label: '高一'},{value: '6',label: '高二'},{value: '7',label: '高三'}, 
                ],
                
                sessionCode:"1",				//应往届
				sessionCodeList:[			//应往届选择项
					{value:"1",label: '应届'},
					{value:"0",label: '往届'}
				],
				recordCount:0,				//总条数
				
				current:1,					//页码
				graduateYear:"",			//毕业年份
            }
        },
        components:{
			addcalculation,
		},
        created(){
//      	this.getaddcalculationpermission();
        	this.getgradelist();
        },
        methods:{
        	...mapMutations([
				"SAVE_EXCEL_NAME"
			]),
        	lookdetail:function(value,gradeid,name,gradeName,baseExamName,thisExamName,createTime){
				//保存评价id到sessionstorage
				setsessionstorage('performId',value);
				setsessionstorage('gradeId',gradeid);
				setsessionstorage('excelname',name);
				setsessionstorage('gradeName',gradeName);
				setsessionstorage('baseExamName',baseExamName);
				setsessionstorage('thisExamName',thisExamName);
				setsessionstorage('createTime',createTime);
        		this.$router.push({name:'querydetailedmiddle'})
        	},
        	
        	addcalculation:function(){
        		this.show = true;
        	},
//      	chance:function(){
//         		this.show = false;
//         		this.getcalculationlist()
//         	},
        	getgradelist:function(){
           		this.gradelistshow = true;
           		var self = this;
            	let url = api.apidomain+'/tqes/web/tchGrade/selectGrade';
            	this.$http.post(url, {"type":"Middle"}).then(function(response) {
					if(response.data.success == true){
						
//						////console.log(response.data.data)
						self.gradelist = response.data.data
						if(self.gradelist.length > 0){
							self.gradeselect = self.gradelist[0].value
							self.getcalculationlist();
						}
						self.gradelistshow = false;
		            }else if(response.data.success == false){
		            		self.$Message.error({
								content: response.data.msg,
								duration: 10,
								closable: true
							});
		            		self.gradelistshow = false;
		            	}
					})
					.catch(function(error) {
						self.$Message.error({
							content: '系统发生错误：错误码00207',
							duration: 10,
							closable: true
						});
						self.gradelistshow = false;
					});
           	},
           	
           	//应届往届改变后数据重新加载
           	sessionCodeChange:function(){
           		if(this.sessionCode == "0"){
           			//判断如果是往届的话把数据清空
           			this.list = []
           			this.current = 1;
        			this.getcalculationlist()
           		}
           		if(this.sessionCode == "1"){
           			//判断如果是应届重新加载第一项数据
           			this.getcalculationlist()
           		}
           	},
           	//改变年级后获取评价列表
			gradechange:function(){
				
				this.current = 1;
        		this.getcalculationlist()
        	},
        	pageChange:function(value){
        		this.current = value;
        		this.getcalculationlist()
        	},
        	//获取往届的评价列表
        	getGraduateList:function(){
        		
        		this.current = 1;
        		this.getcalculationlist()
        	},
           	
           	getcalculationlist:function(){
           		
           		this.listshow = true;
           		let sessionroleid = getsessionstorage('roleid');
           		var self = this;
           		
           		if(this.sessionCode == "1"){
           			var senddata = {
	           			sessionCode:this.sessionCode,
	           			gradeId:this.gradeselect,
	           			graduateYear:"",					//界别（往届）
	           			type:"Middle",
	           			roleId: sessionroleid,
						current:this.current,						//当前页数
						pageSize:"10"						//每页显示行数
	           		}
           		}else if(this.sessionCode == "0"){
           			var senddata = {
	           			sessionCode:this.sessionCode,
	           			gradeId:"",
	           			graduateYear:this.graduateYear,					//界别（往届）
	           			type:"Middle",
	           			roleId: sessionroleid,
						current:this.current,						//当前页数
						pageSize:"10"						//每页显示行数
	           		}
           		}
           		
            	let url = api.apidomain+'/tqes/web/quaPerformance/getPerformancesByPage';
            	this.$http.post(url, senddata).then(function(response) {
					if(response.data.success == true){
						
//						//console.log(response.data.data.items)
						self.list = response.data.data.items
						self.recordCount = response.data.data.recordCount
						if(self.list.length == 0){
							self.textinfo = "查询信息为空"
						}
						self.listshow = false;
		            }else if(response.data.success == false){
		            		self.$Message.error({
								content: response.data.msg,
								duration: 10,
								closable: true
							});
		            		self.listshow = false;
		            	}
					})
					.catch(function(error) {
						self.$Message.error({
							content: '系统发生错误：错误码00208',
							duration: 10,
							closable: true
						});
						self.listshow = false;
					});
           	},
   			deldata:function(value){
				this.$Modal.confirm({
                    title: '确定删除',
                    content: '<p>确定删除这一条年级信息吗</p>',
                    onOk: () => {
                        this.$Message.loading({
		                    content: '正在删除中',
		                    duration: 0
		                });
		                
		                //删除年级的接口
		                var self = this;
		            	let url = api.apidomain+'/tqes/web/quaPerformance/deletePerformances';
		            	this.$http.post(url, {performId:value}).then(function(response) {
							if(response.data.success == true){
								self.$Message.destroy();
								self.$Message.success('删除成功');
								self.getcalculationlist();
				            }else if(response.data.success == false){
				            		self.$Message.error({
										content: response.data.msg,
										duration: 10,
										closable: true
									});
				            	}
							})
							.catch(function(error) {
								self.$Message.error({
									content: '系统发生错误：错误码00209',
									duration: 10,
									closable: true
								});
							});
		                
		                
		                
                    },
                    onCancel: () => {
//                      this.$Message.info('Clicked cancel');
                    }
                });
			},
			//增加评价计算按钮显示隐藏
//			getaddcalculationpermission:function(){
//				let sessionroleid = getsessionstorage('roleid');
//				if(sessionroleid){
//					var senddata = {
//						"role":sessionroleid,
//						"ress":['achievements_query_add']
//					}
//					this.menushow = true;
//					var self = this;
//	            	let url = api.apidomain+'/tqes/web/sysRes/getResPowerByRole';
//	            	this.$http.post(url,senddata).then(function(response) {
//						if(response.data.success == true){
////							////console.log(response.data.data)
//							
//							self.achievements_query_add = response.data.data.achievements_query_add,
//							
//							self.menushow = false;
//							
//		            }else if(response.data.success == false){
////		            		self.$Message.error({
//								content: response.data.msg,
//								duration: 10,
//								closable: true
//							});
//		            	}
//		            	
//					})
//					.catch(function(error) {
//						self.$Message.error('系统发生错误');
//					});
//				}	
//			},
        }
    }
</script>

<style lang="css" scoped>
	.changegray >>> .ivu-card-body{
		padding: 12px 15px;
		background-color: #f7f7f7;
	}
/*.ivu-collapse{
	text-align: left;	
}
.ivu-collapse-content>.ivu-collapse-content-box{
	padding:5px !important;
}
.ivu-collapse > .ivu-collapse-item > .ivu-collapse-header{
	height: auto !important;
}*/
</style>